<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script type="text/javascript" src="swell.0.1.js"></script>
<script type="text/javascript">

var canvas, ctx;

function init() {

	canvas = document.getElementById("logo-canvas");
	ctx = canvas.getContext('2d');
	
	loadSVG("swell-logo.svg", receiveSVG, fail);
	
}

function receiveSVG(svg) {
	svg.draw(ctx);
}

function fail(filename) {
	alert("Could not load SVG \"" + filename + "\"");
}

</script>
<style type="text/css">
* { 
margin: 0;
padding: 0;
}

body { 
background-color: #222;
}

#container { 
margin: 20px auto;
width: 730px;
}

pre { 
padding: 20px;
background-color: #000;
color: #999;
font: 11px Monaco, monospace;
}

span.success { 
color: #08c;
}

span.context { 
color: #c08;
}

span.hide { 
color: #555;
}

</style>
</head> 
<body onload="init()"> 

<div id="container">
<canvas id="logo-canvas" width="730" height="350">

</canvas>
<pre><span class="hide">&lt;script type=&quot;text/javascript&quot; src=&quot;swell.0.1.min.js&quot;&gt;&lt;/script&gt;
&lt;script type=&quot;text/javascript&quot;&gt;</span>

var <span class="context">context</span>;

function init() {
	<span class="context">context</span> = document.getElementById(&quot;logo-canvas&quot;).getContext("2d");
	<span class="highlight">loadSVG(&quot;swell-logo.svg&quot;, <span class="success">receiveSVG</span>);</span>
}

function <span class="success">receiveSVG</span>(svg) {
	<span class="highlight">svg.draw(<span class="context">context</span>);</span>
}

<span class="hide">&lt;/script&gt;
&lt;/head&gt;
&lt;body onload="init()"&gt;</span>
</pre>

</div>
</body>
</html>